﻿
// var stringOfText1 = '... with a new string of text. Convenient for those "read more..." links.';
//        var stringOfText2 = ' spots on the same page; the animations will be consecutive.';
var stringOfText3 = 'Nội dung Nội dung Nội dung Nội dung&|\ Nội dung Nội dung Nội dung <br/> Nội dung Nội dung Nội dung Nội dung Nội dung Nội dung Nội dung Nội dung...';

// Animation
var textHolder;
var textTarget;
var letter;
var index;
var printing;
var waiting = false;
var cursor = new Array("\\", "|", "/", "-");
// Start

spellString = function (oId, str) {
    waiting = false;
    if (waiting == false) {
        index = 0;
        waiting = true;
        textTarget = document.getElementById(oId);
        textTarget.innerHTML = '';
        textHolder = str.split('');
        sendToPrint();
        letter = '';
    }
}

// Animation

sendToPrint = function () {
    if (index < textHolder.length) {
        printing = window.setTimeout(
    	 function () {
    	     getLetter(textTarget, index);
    	 }, 50);
    } else {
        waiting = false;
    }
}

getLetter = function (textTarget, index) {
    letter += textHolder[index];
    //            if (letter.value == '\\') letter.value = '';
    printLetter(textTarget, letter);
}

printLetter = function (textTarget, letter) {
    textTarget.innerHTML = letter + (index < textHolder.length - 1 ? ' ' + cursor[index % cursor.length] : '');
    window.clearTimeout(printing);
    index++;
    sendToPrint();
}
$(document).ready(function () {

    var imgs = $('#slideshow div#slideshow-left').find('img').removeClass('img-current');
    imgs.eq(0).addClass('img-current');
    $('#slide-title').text(imgs.eq(0).attr('slTitle'));
    $('#slide-subconten').text(imgs.eq(0).attr('slSubConten'));
    $('#slideshow-right-top').find('#link').attr('href', 'DiemDenDuLich.aspx?Place=' + imgs.eq(0).attr('slID'));
    var html = "<div class=\"slideshow-right-bottom\">";
    for (var i = 0; i < imgs.length; i++) {
        $(imgs[i]).css("left", 491 * i);
        html += "<span class=\"slide-index\">" + (i + 1) + "</span>";
    }
    html += "</div>";
    $('#slideshow-right').append(html);

    var $index = $('#slideshow-right div.slideshow-right-bottom span');
    var curr = indexcurr(imgs);
    $($index[curr]).addClass("slide-current");

    var next;
    if (curr + 1 < $(imgs).length) {
        next = curr + 1;
    }
    else
        next = 0;

    var time = setInterval(function () { slide(); }, 10000);


    var time2;
    $(".slide-index").click(function () {
        $("span.slide-current").removeClass("slide-current");
        $(this).addClass("slide-current");
        next = parseInt($(this).text() - 1);
        clearInterval(time);
        clearTimeout(time2);
        slide();
        time2 = setTimeout(function () { time = setInterval(function () { slide(); }, 10000); }, 1000);




    });
    function indexcurr(el) {
        for (var i = 0; i < $(el).length; i++) {

            if ($(el[i]).attr("class") == "img-current")
                return i;
        }
        return -1;
    }
    function slide() {
        $(imgs[curr]).removeAttr("class");
        
        $(imgs[next]).addClass("img-current");
        $($index[curr]).removeClass("slide-current");
        $($index[next]).addClass("slide-current");
        $('#slide-title').text(imgs.eq(next).attr('slTitle'));
        $('#slideshow-right-top').find('#link').attr('href', 'DiemDenDuLich.aspx?Place=' + imgs.eq(next).attr('slID'));
        spellString('slide-subconten', $('.img-current').attr('slSubConten'));
        for (var i = 0; i < $(imgs).length; i++) {

            if (i != next) {
                $(imgs[i]).stop().animate({ left: 491 * (i - next) }, 1000);
            }
            else {
                $(imgs[next]).stop().animate({ left: 0 }, 1000);
            }
        }
        curr = next;

        if (curr + 1 < $(imgs).length) {
            next = curr + 1;

        }
        else
            next = 0;

    }
    function chuyen(vt, elcurrent) {
        var s = 0;

        var i = 0;
        for (; i < $(imgs).length; i++) {
            if ($(imgs[i]).attr("class") == "img-current") {
                break;
            }
        }
        if ($(elcurrent).offset().left - $('#slideshow-left').offset().left > 0) {
            s = 491 * Math.abs(vt - i);
        }
        else {
            s = -491 * Math.abs(i - vt);
        }



        for (var j = 0; j < $(imgs).length; j++) {

            if (j != i) {

                if ($(imgs[j]).offset().left - $('#slideshow-left').offset().left > 0)
                    s2 = 491 * Math.abs(vt - j);
                else
                    s2 = -491 * Math.abs(vt - j);
                $(imgs[j]).stop(true, true).animate({ left: s2 - s }, 600);
            }
        }
        $(elcurrent).stop(true, true).animate({ left: 0 }, 600);
    }

});